<template>
  <div>
    <a-card
      style="width:100%"
      :tab-list="tabListNoTitle"
      :active-tab-key="noTitleKey"
      :hoverable="true"
      @tabChange="key => onTabChange(key, 'noTitleKey')"
    >
      <p v-if="noTitleKey === 'time'">
        <LeaderListTable :type = "noTitleKey"/>
      </p>
      <p v-else-if="noTitleKey === 'praise'">
        <LeaderListTable :type = "noTitleKey"/>
      </p>
      <p v-else="noTitleKey === 'collection'">
        <LeaderListTable :type = "noTitleKey"/>
      </p>
    </a-card>
  </div>
</template>

<script>
import LeaderListTable from '@/components/Table/LeaderListTable';

export default {
  data() {
    return {
      tabListNoTitle: [
        {
          key: 'time',
          tab: '最新文章',
        },
        {
          key: 'praise',
          tab: '好评文章',
        },
        {
          key: 'collection',
          tab: '推荐文章',
        },
      ],
      noTitleKey: 'time',
    };
  },
  components: { LeaderListTable },
  methods: {
    onTabChange(key, type) {
      this[type] = key;
    },
  }
};
</script>
